<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>ReactJSX</title>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
</head>

<body>


	<!-- 
	React 可以渲染 HTML 标签 (strings) 或 React 组件 (classes)。

     要渲染 HTML 标签，只需在 JSX 里使用小写字母的标签名
     。
     要渲染 React 组件，只需创建一个大写字母开头的本地变量 -->
	<div id="example"></div>
	<script type="text/babel">

    {/**样式**/}
   var mystyle = {
        fontSize: 100,
    	color: '#FF0000'
   };
    
    {/**数组**/}
	var h_arr = [
		<h1 style = {mystyle}>菜鸟教程</h1>,
      	<h2>欢迎学习 React</h2>,
      	<p>这是一个很不错的 JavaScript 库!</p>
	];
     ReactDOM.render(
      	<div> { h_arr } </div>,
        document.getElementById('example')
    );
    </script>
</body>
</html>